import { formatDisplayValue } from "../utils.mjs";

/**
 * 基础渲染器类
 * 提供通用的渲染方法和工具函数
 */
export class BaseRenderer {
  /**
   * 创建只读值的显示元素
   * @param {Object} schema - Schema定义
   * @param {*} data - 数据值
   * @returns {HTMLElement} 显示元素
   */
  static createReadOnlyElement(schema, data) {
    if (!schema.type && typeof data === "object" && data !== null) {
      const pre = document.createElement("pre");
      pre.className = "readonly-value json-text";
      pre.textContent = JSON.stringify(data, null, 2);
      return pre;
    } else {
      const span = document.createElement("span");
      span.className = "readonly-value";
      span.textContent = formatDisplayValue(schema, data);
      return span;
    }
  }

  /**
   * 创建属性标签
   * @param {Object} schema - Schema定义
   * @returns {HTMLElement} 标签元素
   */
  static createPropertyLabel(schema) {
    const property_label = document.createElement("property_label");
    property_label.textContent =
      schema.description || schema.name || schema.title || "";

    if (schema.name && schema.description) {
      const propertyName = document.createElement("span");
      propertyName.className = "property-name";
      propertyName.textContent = ` (${schema.name})`;
      property_label.appendChild(propertyName);
    }

    return property_label;
  }

  /**
   * 处理宽度配置
   * @param {HTMLElement} element - 要设置宽度的元素
   * @param {Object} schema - Schema定义
   */
  static handleWidthConfig(element, schema) {
    if (schema.thin?.width) {
      element.style.width = schema.thin.width;
    }
  }
}
